// pie3dOption.ts
import _ from 'lodash';
import { EChartsOption, SeriesOption } from 'echarts';
import 'echarts-gl';
// ===========      3D饼图       =============
interface PieDataItem {
  name: string;
  value: number;
  actValue?: number;
  itemStyle?: {
    opacity?: number;
    color?: string;
  };
  label?: any;
  startRatio?: number;
  endRatio?: number;
}

interface ParametricEquation {
  u: { min: number; max: number; step: number };
  v: { min: number; max: number; step: number };
  x: (u: number, v: number) => number;
  y: (u: number, v: number) => number;
  z: (u: number, v: number) => number;
}

// 获取扇形曲面参数方程
function getParametricEquation(
  startRatio: number,
  endRatio: number,
  isSelected: boolean,
  isHovered: boolean,
  k: number,
  h: number
): ParametricEquation {
  const midRatio = (startRatio + endRatio) / 2;
  const startRadian = startRatio * Math.PI * 2;
  const endRadian = endRatio * Math.PI * 2;
  const midRadian = midRatio * Math.PI * 2;

  if (startRatio === 0 && endRatio === 1) {
    isSelected = false;
  }

  const offsetX = isSelected ? Math.cos(midRadian) * 0.1 : 0;
  const offsetY = isSelected ? Math.sin(midRadian) * 0.1 : 0;
  const hoverRate = isHovered ? 1.05 : 1;

  return {
    u: { min: -Math.PI, max: Math.PI * 3, step: Math.PI / 32 },
    v: { min: 0, max: Math.PI * 2, step: Math.PI / 20 },
    x: (u, v) => {
      if (u < startRadian) return offsetX + Math.cos(startRadian) * (1 + Math.cos(v) * k) * hoverRate;
      if (u > endRadian) return offsetX + Math.cos(endRadian) * (1 + Math.cos(v) * k) * hoverRate;
      return offsetX + Math.cos(u) * (1 + Math.cos(v) * k) * hoverRate;
    },
    y: (u, v) => {
      if (u < startRadian) return offsetY + Math.sin(startRadian) * (1 + Math.cos(v) * k) * hoverRate;
      if (u > endRadian) return offsetY + Math.sin(endRadian) * (1 + Math.cos(v) * k) * hoverRate;
      return offsetY + Math.sin(u) * (1 + Math.cos(v) * k) * hoverRate;
    },
    // z: (u, v) => {
    //   if (u < -Math.PI * 0.5 || u > Math.PI * 2.5) return Math.sin(u);
    //   return Math.sin(v) > 0 ? h : -1;
    // },
    z: function (u, v) {
      if (u < -Math.PI * 0.5) {
        return Math.sin(u);
      }
      if (u > Math.PI * 2.5) {
        return Math.sin(u) * h * 0.1;
      }
      return Math.sin(v) > 0 ? 1 * h * 0.1 : -1;
    },
  };
}
const colors =['#35CFE8','#FFF7A1','#076EFF','#31CE87','#F0974A']
// 生成 3D 饼图配置项
export function getPie3D(pieData: PieDataItem[], internalDiameterRatio = 0): EChartsOption {
  const series: SeriesOption[] = [];
  let sumValue = 0;
  let startValue = 0;
  let endValue = 0;
  const k = (1 - internalDiameterRatio) / (1 + internalDiameterRatio);

  pieData.forEach((item) => {
    sumValue += item.value;
    item.itemStyle={
      color:colors[series.length%colors.length],
    }
    const seriesItem: any = {
      name: item.name ?? '',
      type: 'surface',
      parametric: true,
      wireframe: { show: false },
      pieData: item,
      value: item.value,
      pieStatus: { selected: false, hovered: false, k },
    };
    if (item.itemStyle) {
      seriesItem.itemStyle = {
        ...item.itemStyle,
      };
    }
    series.push(seriesItem);
  });

  series.forEach((s, i) => {
    endValue = startValue + s.pieData.value;
    s.pieData.startRatio = startValue / sumValue;
    s.pieData.endRatio = endValue / sumValue;
    s.parametricEquation = getParametricEquation(
      s.pieData.startRatio,
      s.pieData.endRatio,
      true,
      false,
      k,
      (s.value / sumValue )*600
    );
    startValue = endValue;
  });

  series.push({
    name: 'pie2d',
    type: 'pie',
    labelLayout: {
      hideOverlap: false, // 自动隐藏重叠的标签
      moveOverlap: 'shiftY', // 重叠时上下移动标签
    },
    label: {
      color: '#ffffff',
      opacity: 1,
      fontSize: window.innerWidth < 1920 ? 9 : 12, // 根据分辨率动态设置字体大小
      fontFamily: 'Microsoft YaHei',
      formatter: (params: any) => {
        const total = _.sumBy(pieData, 'value');
        // return `${params.data.name}\n${params.data.value}人\n${((params.data.value / total) * 100).toFixed(2)}%`;
        return `${params.data.name}\n${params.data.value}人`;
      },
    },
    labelLine: {
      length: 40,
    },
    startAngle: -30,
    clockwise: false,
    radius: ['40%', '60%'],
    center: ['50%', '50%'],
    data: pieData,
    itemStyle: {
      opacity: 0,
    },
  });

  // series.push({
  //   name: 'mouseoutSeries',
  //   type: 'surface',
  //   parametric: true,
  //   wireframe: { show: false },
  //   itemStyle: {
  //     opacity: 1,
  //     color: '#102b6f',
  //   },
  //   parametricEquation: {
  //     u: { min: 0, max: Math.PI * 2, step: Math.PI / 20 },
  //     v: { min: 0, max: Math.PI, step: Math.PI / 20 },
  //     x: (u, v) => ((Math.sin(v) * Math.sin(u) + Math.sin(u)) / Math.PI) * 3.75,
  //     y: (u, v) => ((Math.sin(v) * Math.cos(u) + Math.cos(u)) / Math.PI) * 3.75,
  //     z: (u, v) => (Math.cos(v) > 0 ? -5 : -7),
  //   },
  // });

  const option: EChartsOption = {
    // backgroundColor: "#123756",
    tooltip: {
      backgroundColor: "rgba(17,95,182,0.5)",
      borderColor: 'rgba(143, 225, 252, 0.60)',
      padding: 8,
      textStyle: { color: '#fff' },
      formatter: (params: any) => {
        if (params.seriesName !== 'mouseoutSeries') {
          return `${params.marker}${params.seriesName}：${pieData[params.seriesIndex].value}人`;
        }
        return '';
      },
    },
    xAxis3D: { min: -1, max: 1 },
    yAxis3D: { min: -1, max: 1 },
    zAxis3D: { min: -1, max: 1 },
    grid3D: {
      show: false,
      top: '4%',
      boxHeight: 1,
      viewControl: {
        alpha: 27,  // 俯视角度
        beta: 30,   // 旋转角度
        rotateSensitivity: 0, // 禁止鼠标旋转
        zoomSensitivity: 0,
        panSensitivity: 0,
        autoRotate: false,
        distance: 300,
      },
    },
    series,
  };

  return option;
}



// ===========      3D柱状图       =============

interface BarChartItem {
  name: string;
  data: { name: string; value: number }[];
}

// 封装函数
export function getBarChartOption(data: BarChartItem[]): EChartsOption {
  const circleColors: string[][] = [
    ['#A0D8FF', '#1188CD'],
    ['#A0D8FF', '#1188CD'],
    ['#A0D8FF', '#1188CD'],
    ['#A0D8FF', '#1188CD'],
    ['#A0D8FF', '#1188CD'],
  ];

  const datasColors: { [key: string]: string }[][] = [
    [{ '0': '#1188CD', '1': '#0C6BA3' }, { '0': '#0C6BA3', '1': '#084E7A' }],
    [{ '0': '#1188CD', '1': '#0C6BA3' }, { '0': '#0C6BA3', '1': '#084E7A' }],
    [{ '0': '#1188CD', '1': '#0C6BA3' }, { '0': '#0C6BA3', '1': '#084E7A' }],
    [{ '0': '#1188CD', '1': '#0C6BA3' }, { '0': '#0C6BA3', '1': '#084E7A' }],
    [{ '0': '#1188CD', '1': '#0C6BA3' }, { '0': '#0C6BA3', '1': '#084E7A' }],
  ];

  const seriesData: EChartsOption['series'] = [];

  data.forEach((item, index) => {
    seriesData!.push(
      {
        name: '',
        type: 'pictorialBar',
        symbolSize: [22, 12],
        symbolOffset: [0, -8],
        z: 3,
        symbolPosition: 'end',
        label: { show: false },
        silent: true,
        data: item.data.map((ix, ind) => ({
          name: ix.name,
          value: ix.value,
          itemStyle: {
            normal: {
              opacity: 1,
              color: {
                type: 'linear',
                x: 0, y: 0, x2: 1, y2: 1,
                colorStops: [
                  { offset: 1, color: circleColors[ind % circleColors.length][index] }
                ],
                global: false
              }
            }
          }
        }))
      },
      {
        name: '',
        type: 'pictorialBar',
        symbolSize: [22, 12],
        symbolOffset: [0, -10],
        z: 1,
        symbolPosition: 'end',
        label: { show: false },
        silent: true,
        data: item.data.map((ix, ind) => ({
          name: '',
          value: 0,
          itemStyle: {
            normal: {
              opacity: 1,
              color: {
                type: 'linear',
                x: 0, y: 0, x2: 1, y2: 0,
                colorStops: [
                  { offset: 0, color: datasColors[ind % datasColors.length][index]['0'] },
                  { offset: 0.4, color: datasColors[ind % datasColors.length][index]['0'] },
                  { offset: 0.6, color: datasColors[ind % datasColors.length][index]['1'] },
                  { offset: 1, color: datasColors[ind % datasColors.length][index]['1'] }
                ],
                global: false
              }
            }
          }
        }))
      },
      {
        name: item.name,
        type: 'bar',
        barWidth: 22,
        z: 2,
        axisLabel: { show: false },
        data: item.data.map((ix, ind) => ({
          name: ix.name,
          value: ix.value,
          itemStyle: {
            normal: {
              opacity: 1,
              color: {
                type: 'linear',
                x: 0, y: 0, x2: 1, y2: 0,
                colorStops: [
                  { offset: 0, color: datasColors[ind % datasColors.length][index]['0'] },
                  { offset: 0.4, color: datasColors[ind % datasColors.length][index]['0'] },
                  { offset: 0.6, color: datasColors[ind % datasColors.length][index]['1'] },
                  { offset: 1, color: datasColors[ind % datasColors.length][index]['1'] }
                ],
                global: false
              }
            }
          }
        }))
      }
    );
  });

  return {
    // backgroundColor: "#061740",
    tooltip: {
      backgroundColor: "rgba(17,95,182,0.5)",
      borderColor: 'rgba(143, 225, 252, 0.60)',
      padding: 8,
      textStyle: { color: '#fff' }
    },
    grid: { bottom: 50 },
    xAxis: [{
      type: 'category',
      data: data[0]?.data.map(d => d.name) || [],
      offset: 10,
      axisLine: {
        show: true,
        lineStyle: {
          color: "#C5C5C5",
          width: 1,
          type: "solid"
        }
      },
      axisLabel: {
        textStyle: {
          color: '#F5F5F5',
          fontSize: 12
        }
      }
    }],
    yAxis: [{
      splitLine: {
        show: true,
        lineStyle: {
          color: '#979797',
          type: [5, 10]
        }
      },
      minInterval:1,
      axisLabel: {
        textStyle: {
          color: '#F5F5F5',
          fontSize: 12
        }
      }
    }],
    series: [
      ...seriesData
    ]
  };
}


// ===========      3D双折线图      =============
/**
 * 生成双折线图的 ECharts 配置项
 * @param barData 第一条折线图
 * @param lineData 第二条折线图
 * @param xLabel 横轴时间标签
 */
export function getBarAndLineChartOption(
  barData: number[],
  lineData: number[],
  xLabel: string[]
): EChartsOption {
  return {
    // backgroundColor: "#0C2B60",
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow"
      },
      textStyle: {
        color: "#fff",
        fontSize: 12
      },
      confine: true,
      backgroundColor: "rgba(17,95,182,0.5)",
      borderColor: 'rgba(143, 225, 252, 0.60)',
      formatter: (params: any) => {
        const [lineData, barData] = params; // 假设有两个系列
        return `
          ${lineData.axisValue}<br>
          ${lineData.seriesName}：${lineData.data}人<br>
          ${barData.seriesName}：${barData.data}人
        `;
      },
    },
    legend: {
      top: "4%",
      left: "center",
      itemWidth: 18,
      itemHeight: 10,
      itemGap: 30,
      textStyle: {
        fontSize: 12,
        color: "#fff",
        padding: [0, 0, 0, 10]
      }
    },
    grid: {
      top: "18%",
      left: "5%",
      right: "5%",
      bottom: "2%",
      containLabel: true
    },
    xAxis: [
      {
        type: "category",
        data: xLabel,
        axisTick: {
          show: false,
          alignWithLabel: true
        },
        axisLine: {
          lineStyle: {
            color: "#1C82C5"
          }
        },
        axisLabel: {
          interval: (index) => index % 2 === 1, // 每隔一个标签显示
          margin: 10,
          color: "#05D5FF",
          fontSize: 12
        }
      }
    ],
    yAxis: [
      {
        name: "人",
        splitNumber: 5,
        minInterval:1,
        type: "value",
        nameTextStyle: {
          color: "#fff",
          fontSize: 12,
          align: "center",
          padding: [0, 28, 0, 0]
        },
        axisLabel: {
          show: true,
          fontSize: 12,
          color: "#fff"
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: "#1C82C5"
          }
        },
        axisTick: {
          show: false
        },
        splitLine: {
          show: false
        }
      },
      {
        name: "人",
        splitNumber: 5,
        minInterval:1,
        type: "value",
        nameTextStyle: {
          color: "#fff",
          fontSize: 12,
          align: "center",
          padding: [0, 0, 0, 25]
        },
        axisLabel: {
          show: true,
          fontSize: 12,
          color: "#fff"
        },
        axisLine: {
          show: true,
          lineStyle: {
            color: "#1C82C5"
          }
        },
        axisTick: {
          show: false
        },
        splitLine: {
          show: false
        }
      }
    ],
    series: [
      {
        name: "电访",
        type: "line",
        yAxisIndex: 0,
        showSymbol: true,
        symbolSize: 8,
        lineStyle: {
          color: "#00FFF686"
        },
        itemStyle: {
          color: "#00FFF686",
          borderColor: "#00FFF686",
          borderWidth: 2
        },
        label: {
          show: false,
          position: "bottom",
          fontSize: 14,
          color: "#91CDFE"
        },
        areaStyle: {
          color: {
            type: "linear",
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              { offset: 1, color: "#00FFF686" },
              { offset: 0.25, color: "#00FFF600" }
            ]
          }
        },
        data: lineData
      },{
        name: "面访",
        type: "line",
        yAxisIndex: 1,
        showSymbol: true,
        symbolSize: 8,
        lineStyle: {
          color: "#3681FF86"
        },
        itemStyle: {
          color: "#3681FF86",
          borderColor: "#3681FF86",
          borderWidth: 2
        },
        label: {
          show: false,
          position: "top",
          fontSize: 14,
          color: "#6fa2fc"
        },
        areaStyle: {
          color: {
            type: "linear",
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              { offset: 1, color: "rgba(9, 63, 109, 1)" },
              { offset: 0.25, color: "rgba(1, 166, 252, 1)" }
            ]
          }
        },
        data: barData
      },
    ]
  };
}


// export function getBarAndLineChartOption(
//   barData: number[],
//   lineData: number[],
//   xLabel: string[]
// ): EChartsOption {
//   return {
//     // backgroundColor: "#0C2B60",
//     tooltip: {
//       trigger: "axis",
//       axisPointer: {
//         type: "shadow"
//       },
//       textStyle: {
//         color: "#fff",
//         fontSize: 12
//       },
//       confine: true,
//       backgroundColor: "rgba(17,95,182,0.5)",
//       borderColor: 'rgba(143, 225, 252, 0.60)',
//       formatter: (params: any) => {
//         const [lineData, barData] = params; // 假设有两个系列
//         return `
//           ${lineData.axisValue}月<br>
//           ${lineData.seriesName}：${lineData.data}人<br>
//           ${barData.seriesName}：${barData.data}人
//         `;
//       },
//     },
//     legend: {
//       top: "4%",
//       left: "center",
//       itemWidth: 18,
//       itemHeight: 10,
//       itemGap: 30,
//       textStyle: {
//         fontSize: 12,
//         color: "#fff",
//         padding: [0, 0, 0, 10]
//       }
//     },
//     grid: {
//       top: "18%",
//       left: "4%",
//       right: "3%",
//       bottom: "2%",
//       containLabel: true
//     },
//     xAxis: [
//       {
//         type: "category",
//         data: xLabel,
//         axisTick: {
//           show: false,
//           alignWithLabel: true
//         },
//         axisLine: {
//           lineStyle: {
//             color: "#1C82C5"
//           }
//         },
//         axisLabel: {
//           interval: (index) => index % 2 === 1, // 每隔一个标签显示
//           margin: 10,
//           color: "#05D5FF",
//           fontSize: 12
//         }
//       }
//     ],
//     yAxis: [
//       {
//         type: "value",
//         name: "人",
//         splitNumber: 5,
//         nameTextStyle: {
//           color: "#fff",
//           fontSize: 12,
//           align: "center",
//           padding: [0, 28, 0, 0]
//         },
//         axisLabel: {
//           formatter: "{value}",
//           color: "#fff",
//           fontSize: 14,
//           lineHeight: 16
//         },
//         axisLine: {
//           show: true,
//           lineStyle: {
//             color: "#1C82C5"
//           }
//         },
//         axisTick: {
//           show: false
//         },
//         splitLine: {
//           show: true,
//           lineStyle: {
//             color: "rgba(28, 130, 197, .3)",
//             type: "dashed"
//           }
//         }
//       },
//       {
//         name: "人",
//         splitNumber: 5,
//         type: "value",
//         nameTextStyle: {
//           color: "#fff",
//           fontSize: 12,
//           align: "center",
//           padding: [0, 0, 0, 25]
//         },
//         axisLabel: {
//           show: true,
//           fontSize: 12,
//           color: "#fff"
//         },
//         axisLine: {
//           show: true,
//           lineStyle: {
//             color: "#1C82C5"
//           }
//         },
//         axisTick: {
//           show: false
//         },
//         splitLine: {
//           show: false
//         }
//       }
//     ],
//     series: [
//       {
//         name: "办结",
//         type: "line",
//         yAxisIndex: 1,
//         showSymbol: true,
//         symbolSize: 8,
//         lineStyle: {
//           color: "#00FFF686"
//         },
//         itemStyle: {
//           color: "#00FFF686",
//           borderColor: "#00FFF686",
//           borderWidth: 2
//         },
//         label: {
//           show: true,
//           position: "top",
//           fontSize: 14,
//           color: "#91CDFE"
//         },
//         areaStyle: {
//           color: {
//             type: "linear",
//             x: 0,
//             y: 0,
//             x2: 0,
//             y2: 1,
//             colorStops: [
//               { offset: 1, color: "#00FFF686" },
//               { offset: 0.25, color: "#00FFF600" }
//             ]
//           }
//         },
//         data: lineData
//       },
//       {
//         name: "代办",
//         type: "bar",
//         barWidth: "12",
//         data: barData,
//         itemStyle: {
//           color: {
//             type: "linear",
//             x: 0,
//             y: 0,
//             x2: 0,
//             y2: 1,
//             colorStops: [
//               { offset: 0, color: "rgba(9, 63, 109, 1)" },
//               { offset: 1, color: "rgba(1, 166, 252, 1)" }
//             ]
//           },
//           borderColor: "#3681FF"
//         }
//       }
//     ]
//   };
// }
// ===========      3D折线图       =============
export function getLineChartOption(
  xAxisData: string[],
  seriesData: number[],
  seriesName: string = '人数'
): EChartsOption {
  return {
    // backgroundColor: '#00266b',
    color: ['#2e6373', '#0055F2', '#F27300'],
    tooltip: {
      trigger: 'axis',
      backgroundColor: "rgba(17,95,182,0.5)",
      borderColor: 'rgba(143, 225, 252, 0.60)',
      padding: 8,
      textStyle: {
        color: '#fff',
      },
    },
    legend: {
      show: false,
    },
    grid: {
      top: "25%",
      left: "5%",
      right: "5%",
      bottom: "8%",
      containLabel: true
    },
    xAxis: {
      type: 'category',
      axisTick: {
        show: false,
      },
      axisLine: {
        show: true,
        lineStyle: {
          color: '#fff',
        },
      },
      axisLabel: {
        show: true,
        color: '#fff',
      },
      data: xAxisData,
    },
    yAxis: {
      name: '人数',
      nameTextStyle: {
        fontSize: 12,
      },
      minInterval:1,
      axisLine: {
        show: true,
        lineStyle: {
          color: '#fff',
          width: 1,
        },
      },
      axisTick: {
        show: true,
      },
      axisLabel: {
        show: true,
        color: '#fff',
      },
      splitLine: {
        show: false,
        lineStyle: {
          color: '#fff',
          width: 1.5,
        },
      },
    },
    series: [
      {
        name: seriesName,
        type: 'line',
        smooth: true,
        symbol: 'circle',
        symbolSize: 5,
        label: {
          show: false,
          position: 'top',
          color: 'rgba(1, 251, 246, 1)',
          fontSize: 16,
        },
        itemStyle: {
          color: '#fff',
          borderColor: '#47ade34f',
          borderWidth: 10,
          shadowColor: '#346a78',
          shadowBlur: 5,
          shadowOffsetY: 1,
          shadowOffsetX: 1,
        },
        tooltip: {
          show: true,
        },
        areaStyle: {
          opacity: 0.8,
          color: {
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [
              {
                offset: 0,
                color: '#286994',
              },
              {
                offset: 1,
                color: 'RGBA(0, 222, 242, 0)',
              },
            ],
          },
        },
        emphasis: {
          focus: 'series',
        },
        data: seriesData,
      },
    ],
  };
}



//=============   地图     ====================
/**
 * 生成3d地图 ECharts 配置项
 * @param isShowLable 是否默认显示lable值（区县默认显示，乡镇鼠标移入显示）
 * 
 */
import bgImage from '@/assets/patient/home/zhumadian.png';
import * as echarts from 'echarts';
import zhumadianJson from '@/views/BigScreen/geoJson/驻马店.json';
export function getMapOption(isShowLable:boolean=true,geoJson:any=zhumadianJson): Promise<echarts.EChartsOption | null> {

  try {
    echarts.registerMap('zhumadian', geoJson as any);
    const option: echarts.EChartsOption = {
      tooltip: {
        show: false,
        trigger: 'item',
        triggerOn: 'click',
      },
      geo: [
        {
          // 高亮 9-10
          show: true,
          map: 'zhumadian',
          zlevel: 8,
          label: {
             show: false
          },
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          itemStyle: {
             normal: {
                color: 'transparent',
                borderWidth: 2,
                borderColor: 'transparent',
             },
          },
          emphasis: {
            label: {
              show: !isShowLable,
              color: '#fff',
              fontSize: 14,
            },
            itemStyle: {
              areaColor: {
                type: 'radial',
                x: 0.5,
                y: 0.5,
                r: 0.8,
                colorStops: [
                  { offset: 0, color: 'transparent' }, // 中心颜色
                  { offset: 1, color: '#59eefc' }, // 边缘颜色
                ],
                global: false,
              },
              borderWidth: 2, // 高亮时的边框宽度
              borderColor: '#59eefc', // 高亮时的边框颜色
            },
          },
          regions: [],
       },
       {
          show: true,
          map: 'zhumadian',
          zlevel: 7,
          label: {
             show: false
          },
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          top: '12%',
          itemStyle: {
             normal: {
                color: 'transparent',
                borderWidth: 2,
                borderColor: 'transparent',
             },
             emphasis: {
                show: false,
                areaColor: "transparent",
             }
          },
          emphasis: {
             show: false,
             label: {
                color: "purple",
                show: false,
             },
          },
          regions: []
       },
       // 外层边框 8
       {
          show: true,
          map: 'zhumadian',
          zlevel: 5,
          label: {
             show: false
          },
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          itemStyle: {
             normal: {
                // areaColor: '#000',
                borderWidth: 4, //设置外层边框
                // borderColor: '#8892a3',
                borderColor: {
                   type: 'linear',
                   x: 0,
                   x2: 0,
                   y: 0,
                   y2: 1,
                   colorStops: [
                      { offset: 0, color: '#697aa5' },
                      { offset: 0.7, color: '#8f9aac' },
                      { offset: 1, color: '#b6c4db' }
                   ]
                },
             },
             emphasis: {
                show: false,
                areaColor: "transparent",
             }
          },
          emphasis: {
             show: false,
             label: {
                color: "yellow",
                show: false,
             }
          },
       },
       // 阴影
       {
          map: 'zhumadian',
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          top: '12%',
          zlevel: 4,
          itemStyle: {
             // color: '#242830', // 背景
             color: {
                type: 'linear',
                x: 0,
                x2: 0,
                y: 0,
                y2: 1,
                colorStops: [
                   { offset: 0, color: '#2e3841' },
                   { offset: 0.4, color: '#272f38' },
                   { offset: 1, color: '#23272f' }
                ]
             },
             borderWidth: '2', // 边框宽度
             borderColor: '#9297a0', // 边框颜色
             emphasis: {
                show: false,
                areaColor: "transparent",
             }
          },
          emphasis: {
             show: false,
             areaColor: "transparent",
             label: {
                color: "yellow",
                show: false,
             }
          },
       },
       {
          map: 'zhumadian',
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          top: '13.5%',
          zlevel: 3,
          itemStyle: {
             color: '#717891', // 背景
             borderWidth: '2', // 边框宽度
             borderColor: '#32364a', // 边框颜色
             emphasis: {
                show: false,
                areaColor: "#717891",
             }
          },
          emphasis: {
             show: false,
             areaColor: "transparent",
             label: {
                show: false,
             }
          },
       },
       {
          map: 'zhumadian',
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          top: '14.5%',
          zlevel: 2,
          itemStyle: {
             color: 'transparent', // 背景
             borderWidth: '2', // 边框宽度
             borderColor: '#2a2e3c', // 边框颜色
             emphasis: {
                show: false,
                areaColor: "transparent",
             }
          },
          emphasis: {
             show: false,
             areaColor: "transparent",
             label: {
                show: false,
             }
          },
       },
       {
          map: 'zhumadian',
          roam: false,
          scaleLimit: {
             min: 1,
             max: 2
          },
          top: '19%',
          zlevel: 1,
          itemStyle: {
             color: 'transparent', // 背景
             borderWidth: '1', // 边框宽度
             borderColor: '#1e3064', // 边框颜色
             emphasis: {
                areaColor: "transparent",
             }
          },
          emphasis: {
             show: false,
             areaColor: "transparent",
             label: {
                show: false,
             }
          },
       },
      ],
      series: [
        {
          type: 'map',
          map: 'zhumadian',
          zlevel: 6,
          label: {
            show: isShowLable,
            color: '#fff',
          },
          roam: false,
          scaleLimit: {
            min: 1,
            max: 2,
          },
          itemStyle: {
            normal: {
              areaColor: {
                image: bgImage,
                repeat: 'repeat',
              },
              borderColor: '#3e4e71',
              borderWidth: 1,
            },
            emphasis: {
              show:false,
            },
          },
        },
      ],
      animation: false,
    };

    return option;
  } catch (err) {
    console.error('加载地图失败:', err);
    return null;
  }
}


//  ====================  失访折线图 =================
// export function getNegativeLineOption(xAxisData: string[],seriesData: number[]) {
//   return{
//     tooltip: {
//       trigger: 'axis',
//       backgroundColor: "rgba(17,95,182,0.5)",
//       borderColor: 'rgba(143, 225, 252, 0.60)',
//       padding: 8,
//       textStyle: {
//         color: '#fff',
//       },
//     },
//     xAxis: {
//       data: xAxisData,
//       type: 'category',
//       boundaryGap: true,
//       itemStyle: {
//         borderColor: 'blue',
//         color: '#ffffff'
//       },
//       axisTick: {
//         show: false
//       },
//       axisLabel: {
//         interval: 0,
//         formatter: function (value, index) {
//           const step = 2;
//           if (index % step === 0) {
//             return value;
//           } else {
//             return '';
//           }
//         },
//         textStyle: {
//           show: true,
//           color: '#fff',
//           fontSize: '12'
//         }
//       },
//       axisLine: {
//         symbol: ['none', 'arrow'],
//         symbolSize: [10, 15],
//         symbolOffset: [0, 0],
//         lineStyle: {
//           width: 2,
//           color: 'rgba(255,255,255,0.6)'
//         }
//       },
//     },
//     yAxis: {
//       name: '失访人数',
//       minInterval:1,
//       nameTextStyle: {
//         color: '#fff',
//         padding: [0, 0, 6, 0]
//       },
//       type: 'value',
//       splitLine: {
//         show: true,
//         lineStyle: {
//           color: 'rgba(255,255,255,0.2)'
//         }
//       },
//       axisLine: {
//         show: true,
//         symbol: ['none', 'arrow'],
//         symbolSize: [10, 15],
//         symbolOffset: [0, 0],
//         lineStyle: {
//           width: 2,
//           color: 'rgba(255,255,255,0.6)'
//         }
//       },
//       axisLabel: {
//         textStyle: {
//           show: true,
//           color: '#fff',
//           fontSize: '12'
//         },
//       },
//     },
//     grid: {
//       left: '5%',
//       top: '15%',
//       right: '5%',
//       bottom: '5%',
//       containLabel: true
//     },
//     series: [{
//       data: seriesData,
//       name: '失访人数',
//       type: 'line',
//       smooth: true,
//       symbolSize: 7, // 不需要点就设置0
//       lineStyle: {
//         width: 2,
//         type: 'solid'
//       },
//       itemStyle: {
//         borderWidth: 5,
//         borderColor: '#1AC9FF',
//         color: '#1AC9FF'
//       },
//       areaStyle: {
//         color: '#F4F65B',
//         normal: {
//           color: new echarts.graphic.LinearGradient(
//             0,
//             0,
//             0,
//             1,
//             [{
//               offset: 0,
//               color: 'rgba(26,201,255,1)'
//             },
//             {
//               offset: 1,
//               color: 'rgba(26,201,255,.1)'
//             }
//             ],
//             false
//           ),
//         }
//       }
//     }]
//   }
// }

export function getNegativeLineOption(seriesData: any): EChartsOption {
  const generateColor = (index: number) => {
    const colors = ['#1E90FF', '#4682B4', '#5F9EA0', '#00CED1', '#4169E1', '#6495ED', '#87CEEB', '#708090'];
    return colors[index % colors.length];
  };

  return {
    backgroundColor: '#050947',
    title: {
      text: '已排查患者',
      left: 'center',
      top: 'center',
      textStyle: {
        color: '#A8D3FF',
        fontSize: 18,
      },
    },
    tooltip: {
      trigger: 'item',
    },
    series: [
      {
        type: 'pie',
        center: ['50%', '50%'],
        radius: ['55%', '80%'],
        label: {
          show: false,
        },
        itemStyle: {
          color: (params) =>
            new echarts.graphic.LinearGradient(1, 0, 0, 0, [
              {
                offset: 0,
                color: generateColor(params.dataIndex),
              },
              {
                offset: 1,
                color: echarts.color.lift(generateColor(params.dataIndex), 0.5),
              },
            ]),
          borderRadius: 4,
          borderColor: '#0F1E4D',
          borderWidth: 10,
        },
        data: seriesData,
      },
      {
        type: 'pie',
        center: ['50%', '50%'],
        radius: ['83%', '85%'],
        silent: true,
        label: {
          show: false,
        },
        itemStyle: {
          color: '#213467',
        },
        data: [
          {
            value: 8,
          },
        ],
      },
      {
        type: 'pie',
        center: ['50%', '50%'],
        radius: ['48%', '52%'],
        silent: true,
        label: {
          show: false,
        },
        itemStyle: {
          color: '#213467',
        },
        emphasis: {
          scale: false,
        },
        data: [
          {
            value: 8,
          },
        ],
      },
    ],
  };
}